<?php
include("../includes/common.php");

$title = '文件查看 - '.$conf['title'];
$is_file=true;
if($conf['forcelogin']==1 && !$islogin2) {loginsmsg('请登录后再操作！');}
include './head.php';
$csrf_token = md5(mt_rand(0,999).time());
$_SESSION['csrf_token'] = $csrf_token;

$hash = isset($_GET['hash'])?$_GET['hash']:exit("<script language='javascript'>window.location.href='./';</script>");
$pwd = isset($_GET['pwd'])?$_GET['pwd']:null;
$row = $DB->getRow("SELECT * FROM pre_file WHERE hash=:hash", [':hash'=>$hash]);
if(!$row)exit("<script language='javascript'>alert('文件不存在');window.location.href='./';</script>");
$name = $row['name'];
$type = $row['type'];

$downurl = 'down.php/'.$row['hash'].'.'.$type;
if(!empty($row['pwd']))$downurl .= '&'.$row['pwd'];
$viewurl = 'viewck.php/'.$row['hash'].'.'.$type;

$downurl_all = $siteurl.$downurl;
$viewurl_all = $siteurl.$viewurl;
// 保持原始本站链接显示，同时按文件存储类型补充云直链（不替换原链接）
$storageType = $row['storage'] ?: $conf['storage'];
$stor = \lib\StorHelper::getModel($storageType);
$isCloud = in_array($storageType, ['oss','qcloud','obs','upyun','qiniu']);
$cloud_viewurl = null;
$cloud_downurl = null;
if($isCloud && $conf['downfile_type'] == 1){
  $cloudView = $stor->getDownUrl($hash, $name, minetype($type));
  if($cloudView) $cloud_viewurl = $cloudView;
  $cloudDown = $stor->getDownUrl($hash, $name, null);
  if($cloudDown) $cloud_downurl = $cloudDown;
}
// 是否启用云直链（按文件自身存储与开关），仅用于补充展示，不替换本站链接
$is_cloud_direct = $isCloud && $conf['downfile_type'] == 1 && (!empty($cloud_viewurl) || !empty($cloud_downurl));

$thisurl = $siteurl.'file.php?hash='.$row['hash'];
if(!empty($pwd))$thisurl .= '&pwd='.$pwd;

if($islogin2 && $row['uid']==$uid || !$islogin2 && isset($_SESSION['fileids']) && in_array($row['id'], $_SESSION['fileids']) && strtotime($row['addtime'])>strtotime("-7 days")){
  $is_mine = true;
}

$view_type = get_view_type($type);

if($view_type == 'image'){
  $filetype = 1;
  $title = '<i class="fa fa-picture-o"></i> 图片查看器';
  // 优先展示：本站链接；若启用云直链，额外提供云直链版本（不替换）
  $htmlcode = htmlspecialchars('<img src="'.($is_cloud_direct?$viewurl_all:$viewurl_all).'"/>');
  $ubbcode = '[img]'.($is_cloud_direct?$viewurl_all:$viewurl_all).'[/img]';
  if($is_cloud_direct && !empty($cloud_viewurl)){
    $htmlcode_cloud = htmlspecialchars('<img src="'.$cloud_viewurl.'"/>');
    $ubbcode_cloud = '[img]'.$cloud_viewurl.'[/img]';
  }
  $linktitle = '图片链接';
}elseif($view_type == 'audio'){
  $filetype = 2;
  $title = '<i class="fa fa-music"></i> 音乐播放器';
  $htmlcode = htmlspecialchars('<audio id="bgmMusic" src="'.$viewurl_all.'" autoplay="autoplay" loop="loop" preload="auto"></audio>');
  $htmlcode2 = htmlspecialchars('<iframe src="'.$siteurl.'player.php?hash='.$hash.'" width="407" scrolling="no"frameborder="0"height="70"></iframe>');
  $ubbcode = '[audio=X]'.$viewurl_all.'[/audio]';
  if($is_cloud_direct && !empty($cloud_viewurl)){
    $htmlcode_cloud = htmlspecialchars('<audio id="bgmMusic" src="'.$cloud_viewurl.'" autoplay="autoplay" loop="loop" preload="auto"></audio>');
    $ubbcode_cloud = '[audio=X]'.$cloud_viewurl.'[/audio]';
  }
  $linktitle = '音乐链接';
}elseif($view_type == 'video'){
  $filetype = 3;
  $title = '<i class="fa fa-video-camera"></i> 视频播放器';
  $htmlcode = htmlspecialchars('<video id="movies" src="'.$viewurl_all.'" autobuffer="true" controls="" width="100%"></video>');
  $htmlcode2 = htmlspecialchars('<iframe src="'.$siteurl.'player.php?hash='.$hash.'" width="800" height="500" scrolling="no" frameborder="0"></iframe>');
  $ubbcode = '[movie=320*180]'.$viewurl_all.'[/movie]';
  if($is_cloud_direct && !empty($cloud_viewurl)){
    $htmlcode_cloud = htmlspecialchars('<video id="movies" src="'.$cloud_viewurl.'" autobuffer="true" controls="" width="100%"></video>');
    $ubbcode_cloud = '[movie=320*180]'.$cloud_viewurl.'[/movie]';
  }
  $linktitle = '视频链接';
}else{
  $filetype = 0;
  $title = '<i class="fa fa-file"></i> 文件查看';
  $htmlcode = htmlspecialchars('<a href="'.$downurl_all.'" target="_blank">'.$name.'</a>');
  $ubbcode = '[url='.$downurl_all.']'.$name.'[/url]';
  if($view_type == 'office'){
    $office_url = 'https://view.officeapps.live.com/op/view.aspx?src='.rawurlencode($downurl_all);
  }
}
?>

  <style>
    :root {
      --primary-color: #4361ee;
      --secondary-color: #3a0ca3;
      --accent-color: #4cc9f0;
      --light-color: #f8f9fa;
      --dark-color: #212529;
      --gray-color: #6c757d;
      --sidebar-width: 250px;
      --transition: all 0.3s ease;
    }
    
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    
    html, body {
      width: 100%;
      height: 100%;
      overflow-x: hidden;
    }
    
    body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      background-color: #f5f7fb;
      color: var(--dark-color);
    }
    
    /* 布局容器 */
    .layout-container {
      display: flex;
      min-height: 100vh;
      width: 100%;
    }
    
    /* 侧边栏样式 */
    .sidebar {
      width: var(--sidebar-width);
      background: linear-gradient(to bottom, var(--primary-color), var(--secondary-color));
      color: white;
      transition: var(--transition);
      position: fixed;
      height: 100vh;
      overflow-y: auto;
      z-index: 1000;
      box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
    }
    
    .sidebar-header {
      padding: 20px 15px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    
    .sidebar-brand {
      font-size: 20px;
      font-weight: 700;
      color: white;
      text-decoration: none;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    
    .sidebar-toggle {
      background: none;
      border: none;
      color: white;
      font-size: 18px;
      cursor: pointer;
      display: none;
    }
    
    .sidebar-nav {
      padding: 15px 0;
    }
    
    .sidebar-nav ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    
    .sidebar-nav li {
      position: relative;
    }
    
    .sidebar-nav a {
      display: flex;
      align-items: center;
      padding: 12px 20px;
      color: rgba(255, 255, 255, 0.8);
      text-decoration: none;
      transition: var(--transition);
      border-left: 3px solid transparent;
    }
    
    .sidebar-nav a:hover, 
    .sidebar-nav a.active {
      background: rgba(255, 255, 255, 0.1);
      color: white;
      border-left-color: var(--accent-color);
    }
    
    .sidebar-nav i {
      width: 24px;
      text-align: center;
      margin-right: 10px;
      font-size: 16px;
    }
    
    .sidebar-nav .nav-text {
      transition: var(--transition);
    }
    
    .dropdown-menu {
      position: static;
      float: none;
      width: 100%;
      background: rgba(0, 0, 0, 0.2);
      border: none;
      box-shadow: none;
      padding: 0;
    }
    
    .dropdown-menu li a {
      padding-left: 50px;
      font-size: 14px;
    }
    
    .dropdown-toggle::after {
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%);
    }
    
    /* 主内容区域 */
    .main-content {
      flex: 1;
      margin-left: var(--sidebar-width);
      transition: var(--transition);
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      width: calc(100% - var(--sidebar-width));
    }
    
    .content-area {
      flex: 1;
      padding: 20px;
      width: 100%;
      box-sizing: border-box;
    }
    
    /* 文件查看页面样式 */
    .file-container {
      max-width: 1200px;
      margin: 0 auto;
    }
    
    .card {
      background: white;
      border-radius: 8px;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
      margin-bottom: 20px;
      border: none;
    }
    
    .card-header {
      background: linear-gradient(to right, var(--primary-color), var(--secondary-color));
      color: white;
      border-radius: 8px 8px 0 0 !important;
      padding: 15px 20px;
      font-size: 18px;
      font-weight: 600;
      border: none;
    }
    
    .card-body {
      padding: 20px;
    }
    
    /* 页面标题和操作按钮 */
    .page-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 20px;
      flex-wrap: wrap;
      gap: 15px;
    }
    
    .page-title {
      font-size: 24px;
      font-weight: 700;
      color: var(--dark-color);
      margin: 0;
    }
    
    .page-actions {
      display: flex;
      gap: 10px;
    }
    
    .btn-action {
      background: linear-gradient(to right, var(--primary-color), var(--secondary-color));
      color: white;
      border: none;
      border-radius: 6px;
      padding: 8px 16px;
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      transition: var(--transition);
      box-shadow: 0 2px 8px rgba(67, 97, 238, 0.2);
      display: inline-flex;
      align-items: center;
      gap: 6px;
      text-decoration: none;
    }
    
    .btn-action:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(67, 97, 238, 0.3);
      color: white;
      text-decoration: none;
    }
    
    .btn-danger {
      background: linear-gradient(to right, #dc3545, #c82333);
    }
    
    /* 文件查看区域 */
    .viewer-center {
      text-align: center;
    }
    
    .image-view img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    }
    
    .file-icon-large {
      font-size: 80px;
      color: var(--primary-color);
      margin-bottom: 20px;
    }
    
    .file-download {
      margin-top: 20px;
    }
    
    .btn-download {
      background: linear-gradient(to right, var(--primary-color), var(--secondary-color));
      color: white;
      border: none;
      border-radius: 6px;
      padding: 12px 24px;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      transition: var(--transition);
      box-shadow: 0 4px 15px rgba(67, 97, 238, 0.3);
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
    }
    
    .btn-download:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(67, 97, 238, 0.4);
      color: white;
      text-decoration: none;
    }
    
    /* 表单样式 */
    .form-group {
      margin-bottom: 15px;
    }
    
    .form-label {
      font-weight: 600;
      margin-bottom: 8px;
      display: block;
    }
    
    .copy-group {
      display: flex;
      gap: 10px;
    }
    
    .copy-group input {
      flex: 1;
      border-radius: 6px;
      border: 1px solid #ced4da;
      padding: 10px 15px;
      font-size: 14px;
    }
    
    .copy-group input:focus {
      outline: none;
      border-color: var(--primary-color);
      box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.2);
    }
    
    .btn-copy {
      background: var(--primary-color);
      color: white;
      border: none;
      border-radius: 6px;
      padding: 10px 15px;
      font-size: 14px;
      cursor: pointer;
      transition: var(--transition);
    }
    
    .btn-copy:hover {
      background: var(--secondary-color);
    }
    
    /* 文件信息表格 */
    .info-table {
      width: 100%;
      border-collapse: collapse;
    }
    
    .info-table th, .info-table td {
      border: 1px solid #e9ecef;
      padding: 12px 15px;
      text-align: left;
    }
    
    .info-table th {
      background: #f8f9fa;
      font-weight: 600;
      width: 150px;
    }
    
    /* 二维码样式 */
    .qrcode-container {
      text-align: center;
    }
    
    .qrcode-container img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
    }
    
    /* 响应式设计 - 平板 */
    @media (max-width: 992px) {
      .sidebar {
        width: 70px;
      }
      
      .sidebar .nav-text,
      .sidebar .sidebar-brand span,
      .sidebar .dropdown-toggle::after {
        display: none;
      }
      
      .sidebar-header {
        justify-content: center;
        padding: 20px 10px;
      }
      
      .sidebar-nav a {
        justify-content: center;
        padding: 15px 10px;
      }
      
      .sidebar-nav i {
        margin-right: 0;
        font-size: 18px;
      }
      
      .dropdown-menu li a {
        padding-left: 20px;
      }
      
      .main-content {
        margin-left: 70px;
        width: calc(100% - 70px);
      }
      
      .sidebar:hover {
        width: var(--sidebar-width);
      }
      
      .sidebar:hover .nav-text,
      .sidebar:hover .sidebar-brand span,
      .sidebar:hover .dropdown-toggle::after {
        display: inline-block;
      }
      
      .sidebar:hover .sidebar-nav a {
        justify-content: flex-start;
        padding: 12px 20px;
      }
      
      .sidebar:hover .sidebar-nav i {
        margin-right: 10px;
      }
      
      .sidebar:hover .dropdown-menu li a {
        padding-left: 50px;
      }
      
      .sidebar:hover .sidebar-header {
        justify-content: space-between;
        padding: 20px 15px;
      }
    }
    
    /* 响应式设计 - 手机 */
    @media (max-width: 768px) {
      .sidebar {
        width: 100%;
        height: auto;
        position: fixed;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        z-index: 1000;
      }
      
      .sidebar.active {
        transform: translateX(0);
      }
      
      .sidebar-toggle {
        display: block;
        position: fixed;
        top: 15px;
        left: 15px;
        z-index: 1001;
        background: var(--primary-color);
        color: white;
        border-radius: 4px;
        padding: 8px 12px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
      }
      
      .main-content {
        margin-left: 0;
        width: 100%;
      }
      
      .content-area {
        padding: 15px;
      }
      
      .sidebar-header {
        padding: 15px;
      }
      
      .sidebar-nav a {
        justify-content: flex-start;
        padding: 12px 20px;
      }
      
      .sidebar-nav i {
        margin-right: 10px;
      }
      
      .nav-text,
      .sidebar-brand span,
      .dropdown-toggle::after {
        display: inline-block !important;
      }
      
      .dropdown-menu li a {
        padding-left: 50px;
      }
      
      .page-bar {
        flex-direction: column;
        align-items: flex-start;
      }
      
      .page-actions {
        width: 100%;
        justify-content: space-between;
      }
      
      .copy-group {
        flex-direction: column;
      }
      
      .info-table {
        font-size: 14px;
      }
      
      .info-table th, .info-table td {
        padding: 8px 10px;
      }
    }
    
    /* 特别针对小屏幕手机的优化 */
    @media (max-width: 480px) {
      .content-area {
        padding: 10px;
      }
      
      .card-body {
        padding: 15px;
      }
      
      .file-icon-large {
        font-size: 60px;
      }
    }
    
    /* 用户头像样式 */
    .user-avatar {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.2);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 10px;
    }
    
    /* 隐藏元素 */
    .hidden-xs {
      display: block;
    }
    
    @media (max-width: 768px) {
      .hidden-xs {
        display: none;
      }
    }
    
    /* 文件类型图标样式 */
    .file-type-icon {
      font-size: 48px;
      color: var(--primary-color);
      margin-bottom: 15px;
    }
    
    /* 文件信息样式 */
    .file-info-text {
      margin-bottom: 20px;
    }
    
    /* 视频播放器容器 */
    .videoplayer {
      width: 100%;
      height: 400px;
    }
    
    /* 音频播放器样式 */
    #aplayer {
      margin: 0 auto;
      max-width: 600px;
    }
    
    /* 文件审核提示 */
    .file-review-notice {
      background: #fff3cd;
      border: 1px solid #ffeaa7;
      border-radius: 6px;
      padding: 15px;
      margin-top: 15px;
      color: #856404;
    }
  </style>
    
    <!-- 主内容区域 -->
    <main class="main-content">
      <div class="content-area">
        <div class="file-container">
          

          <?php
          if($row['pwd']!=null && $row['pwd']!=$pwd){ ?>
            <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
            <script type="text/javascript">
            var pwd=prompt("请输入密码","")
            if (pwd!=null && pwd!="")
            {
                window.location.href="./file.php?hash=<?php echo $row['hash']?>&pwd="+pwd
            }
            </script>
            <div class="alert alert-warning">
              请刷新页面，或 <a href="javascript:history.back();">返回上一页</a>
            </div>
          <?php
            exit;
          }
          ?>

          <div class="row">
            <div class="col-sm-9">
              <!-- 文件查看卡片 -->
              <div class="card">
                <div class="card-header"><?php echo $title?></div>
                <div class="card-body viewer-center">
                  <?php
                  if($filetype==1){
                    echo '<div class="image-view"><a href="'.$viewurl.'" title="点击查看原图"><img alt="loading" src="'.$viewurl.'" class="image-view"></a></div>';
                  }elseif($filetype==2){
                    echo '<div class="view"><div id="aplayer"></div></div>';
                  }elseif($filetype==3 && $row['block']==0){
                    echo '<div class="videoplayer"></div>';
                  }elseif($filetype==3){
                    echo '<div class="view">
                    <div class="file-icon-large">
                      <i class="fas '.type_to_icon($type).'"></i>
                    </div>
                    <div class="file-info-text">
                      <h3>'.$name.'</h3>
                      <div class="file-review-notice">
                        <p>视频文件需审核通过后才能在线播放和下载，请等待审核通过！</p>
                      </div>
                    </div>
                    </div>';
                  }else{
                    echo '<div class="view">
                    <div class="file-icon-large">
                      <i class="fas '.type_to_icon($type).'"></i>
                    </div>
                    <div class="file-info-text">
                      <h3>'.$name.'（'.size_format($row['size']).'）</h3>
                    </div>
                    <div class="file-download">
                      <a href="'.$downurl.'" class="btn-download"><i class="fas fa-download"></i> 下载文件</a>';
                      if($view_type=='office'){
                        echo '<a href="'.$office_url.'" class="btn-download" target="_blank" style="margin-left:10px;"><i class="fas fa-eye"></i> 在线预览</a>';
                      }
                    echo '</div>
                    </div>';
                  }
                  ?>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      
      
    </main>
  </div>
 

  <!-- JavaScript文件 -->
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.5.10/js/material.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.5.10/js/ripples.min.js"></script>
  
  <?php if($filetype==2){ ?>
  <script type="text/javascript" src="https://s4.zstatic.net/ajax/libs/aplayer/1.10.1/APlayer.min.js"></script>
  <script type="text/javascript">
  var ap = new APlayer({
    container: document.getElementById('aplayer'),
    loop: 'none',
    theme: '#b2dae6',
    audio: [{
        title: '<?php echo $name?>',
        author: 'none',
        url: '<?php echo $viewurl_all?>',
        cover: '../assets/img/music.png',
    }]
  });
  </script>
  <?php }elseif($filetype==3 && $row['block']==0){ ?>
  <script type="text/javascript" src="../assets/js/ckplayer.min.js"></script>
  <?php if($type=='m3u8'){$plug='hls.js';?><script src="https://s4.zstatic.net/ajax/libs/hls.js/1.2.4/hls.min.js"></script><?php }?>
  <?php if($type=='flv'||$type=='f4v'){$plug='flv.js';?><script src="https://s4.zstatic.net/ajax/libs/flv.js/1.6.2/flv.min.js"></script><?php }?>
  <script type="text/javascript">
    var videoObject = {
      container: '.videoplayer',
      plug:'<?php echo $plug?>',
      video:'<?php echo $viewurl_all?>',
      webFull:true,
    };
    var player=new ckplayer(videoObject);
  </script>
  <?php } ?>
  
  <script src="https://s4.zstatic.net/ajax/libs/layer/2.3/layer.js"></script>
  <script src="https://s4.zstatic.net/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
  
  <script>
    // 初始化Material Design组件
    $.material.init();
    
    
    // 删除确认函数
    function delete_confirm(){
      var hash = $("#hash").val();
      var csrf_token = $("#csrf_token").val();
      var confirmobj = layer.confirm('删除文件后不可恢复，确定删除吗？', {
        btn: ['确定','取消'], icon: 0
      }, function(){
        var ii = layer.load(2);
        $.ajax({
          type : 'POST',
          url : 'ajax.php?act=deleteFile',
          data : {hash:hash, csrf_token:csrf_token},
          dataType : 'json',
          success : function(data) {
            layer.close(ii);
            if(data.code == 0){
              layer.alert('删除成功', {icon:1}, function(){window.location.href="./";});
            }else{
              layer.alert(data.msg, {icon:2});
            }
          },
          error:function(data){
            layer.close(ii);
            layer.msg('服务器错误');
          }
        });
      }, function(){
        layer.close(confirmobj);
      });
    }
    
    // 复制功能
    $(function(){
      var clipboard = new Clipboard('.copy-btn');
      clipboard.on('success', function () { layer.msg('复制成功！', {icon: 1}); });
      clipboard.on('error', function () { layer.msg('复制失败，请手动复制', {icon: 2}); });
    });
  </script>
</body>
</html>